﻿@model SMEsCustomer360Degree.Models.ViewModels.PortfolioManagement.AccountPlanningViewModel

<div class="">
    <div class="row">
        <div class="col-md-12">
            <div class="x_panel">
                <div class="x_content">
                    <div class="" role="tabpanel" data-example-id="togglable-tabs">
                        <ul class="nav nav-tabs bar_tabs sme-tabs" role="tablist">
                            <li id="pm-ap-tab" role="presentation" class="active">
                                @Html.ActionLink(@SMEsCustomer360Degree.Core.Resources.Resource.AccountPlanning, "AccountPlanning", "PortfolioManagement", null, null)
                            </li>
                            <li id="pm-pm-tab" role="presentation" class="">
                                @Html.ActionLink(@SMEsCustomer360Degree.Core.Resources.Resource.PortManagement, "PortfolioManagement", "PortfolioManagement", null, null)
                            </li>
                        </ul>
                        <div id="myTabContent" class="tab-content">
                            <div role="tabpanel" class="tab-pane fade active in" id="tab_content2" aria-labelledby="profile-tab">
                                <div class="row">
                                    <div class="col-md-12 col-sm-12 col-xs-12">
                                        <div class="x_panel">
                                            <div class="x_title">
                                                <h2>
                                                    @SMEsCustomer360Degree.Core.Resources.Resource.View
                                                    <small>
                                                        @SMEsCustomer360Degree.Core.Resources.Resource.AccountPlanning of @Model.CustName
                                                    </small>
                                                </h2>
                                                <ul class="nav navbar-right panel_toolbox">
                                                    <li>
                                                        <a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                                                    </li>
                                                </ul>
                                                <div class="clearfix"></div>
                                            </div>
                                            <div class="x_content">
                                                <ul class="nav nav-tabs bar_tabs sme-tabs" role="tablist">
                                                    <li id="pm-ap-data-tab" role="presentation" class="active">
                                                        @Html.ActionLink(@SMEsCustomer360Degree.Core.Resources.Resource.AccountPlanningEdit, "ViewDataAccountPlanning", "PortfolioManagement", new { cif = @Model.Cif }, null)
                                                    </li>
                                                    <li id="pm-ap-finance-tab" role="presentation" class="">
                                                        @Html.ActionLink(@SMEsCustomer360Degree.Core.Resources.Resource.AccountPlanningEditFinance, "AccountPlanningFinance", "PortfolioManagement", new { cif = @Model.Cif }, null)
                                                    </li>
                                                    <li id="pm-ap-product-holding-tab" role="presentation" class="">
                                                        @Html.ActionLink(@SMEsCustomer360Degree.Core.Resources.Resource.AccountPlanningEditProductHolding, "ProductHolding", "PortfolioManagement", new { cif = @Model.Cif }, null)
                                                    </li>
                                                </ul>
                                                <div id="pm-ap-data-view-form" class="form-horizontal form-label-left">
                                                    <div class="form-group">
                                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">
                                                            Cif
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.Cif)
                                                            @Html.HiddenFor(m => m.Cif)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="first-name">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.MainSector
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.MainSector)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="last-name">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.PaymentMethod
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.PaymentMethod)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.ActionPlan
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.ActionPlanT62016)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.WalletShare
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.WalletShare)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.CrossSelling
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.SpBanCheo)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.Issue
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.VuongMac)
                                                        </div>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">
                                                            @SMEsCustomer360Degree.Core.Resources.Resource.Suggestion
                                                        </label>
                                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                                            @Html.DisplayFor(m => m.KhHoTro)
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


@section scripts
{
    <script type="text/javascript">
        function startPageTourGuide() {
            var intro = introJs();
            var steps = [
                    {
                        element: '#pm-ap-tab',
                        intro: "@SMEsCustomer360Degree.Core.Resources.Resource.TourGuideAccountPlanningTab"
                    },
                    {
                        element: '#pm-pm-tab',
                        intro: "@SMEsCustomer360Degree.Core.Resources.Resource.TourGuidePortManTab",
                        position: 'right'
                    },
                    {
                        element: '#pm-ap-data-tab',
                        intro: '@SMEsCustomer360Degree.Core.Resources.Resource.TourGuideAccViewDataTab',
                        position: 'bottom'
                    },
                    {
                        element: '#pm-ap-finance-tab',
                        intro: '@SMEsCustomer360Degree.Core.Resources.Resource.TourGuideAccViewFinanceTab',
                        position: 'right',
                    },
                    {
                        element: '#pm-ap-product-holding-tab',
                        intro: "@SMEsCustomer360Degree.Core.Resources.Resource.TourGuideAccViewProductHoldingTab",
                        position: 'bottom'
                    },
                    {
                        element: '#pm-ap-data-view-form',
                        intro: "@SMEsCustomer360Degree.Core.Resources.Resource.TourGuideAccViewDataForm",
                        position: 'bottom'
                    }
            ];
            intro.setOptions({
                steps: steps,
                showProgress: true,
                scrollToElement: true,
            });
            intro.setOption('tooltipPosition', 'auto');
            intro.setOption('positionPrecedence', ['left', 'right', 'bottom', 'top'])
            intro.start();
        }
    </script>
}